﻿<!DOCTYPE html>
<html lang="pt-br">
<head>
    <title>exemplo de carregamento de arquivo</title>
    <link href="Style/box.css" rel="stylesheet" />
</head>
<body>
    <header>
        <h1>Web tv</h1>
    </header>
    <div>
    	<h2>upload texto</h2>
    	<input type="file" id="theTextFile" >
    	<button type="button" id="loadFile">Upload</button>
    	<textarea name="theMessageArea" id="theMessageArea" cols="30" rows="40"></textarea>
    </div>
    <script type="text/javascript">
        
    	var bt = document.getElementById("loadFile");
    	bt.addEventListener("click",onLoadTextFile,false);
    	function onLoadTextFile () {
    	    var theFileElem = document.getElementById("theTextFile");
    	    if (theFileElem.files.length != 0 && theFileElem.files[0].type.match(/text.*/)) {

    	    	var reader = new FileReader();
    	    	
    	    	reader.readAsText(theFileElem.files[0], "ISO-8859-1");

    	    	reader.onload = function(e) {
    	    	    var theMessageAreaElem = document.getElementById("theMessageArea");
    	    	    theMessageAreaElem.value = e.target.result;
    	    	}
    	    	reader.onerror = function(e) {
    	    	    alert("nao foi possivel ler o arquivo de texto");
    	    	}

    	    	

    	    }else{
    	    	alert("selecione um arquivo de texto");
    	    }
    	}
    </script>

    <hr>

    <h2>Div Draggable</h2>
    <div draggable="true" ondrag="handleDrag()">
    	<b>Some Content</b> to be draggable
    </div>
    <script type="text/javascript">
    	function handleDrag (e) {
    	    e.dataTransfer.effectAllowed = 'copy';
    	    e.dataTransfer.setData("text/html", e.target.innerHTML);
    	}
    </script>
</body>
</html>
